<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.6/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
    <el-menu class="el-menu-demo" mode="horizontal" default-active="2"
              active-text-color="#ffd04b"  text-color="#fff" background-color="#545c64">
        <el-menu-item index="1" style="font-size: 50px;margin:10px" @Click="open">日志</el-menu-item>
        <el-menu-item index="2" style="font-size: 50px;margin:10px" >验证管理</el-menu-item>
    </el-menu>
    <div style="margin: 20px"></div>
    <el-form label-width="200px" >
        <el-form-item  label="超时验证码" prop="code">
            <el-col :span="6">
                <el-input v-model="captcha.code" ></el-input>
            </el-col>
            <el-col :span="6">
                <el-button type="success" style="margin-left: 20px" round v-on:click="save">保存</el-button>
            </el-col>
        </el-form-item >
        <el-form-item label="小程序页面显示身份证">
            <el-switch
                    v-model="isShow" v-on:change="exchange">
            </el-switch>
        </el-form-item>
    </el-form>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue@2.6.14/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui@2.15.6/lib/index.js"></script>
<script src="https://unpkg.com/axios@0.25.0/dist/axios.min.js"></script>
<script>
    new Vue({
        el: '#app',
        created(){
            this.get();
            this.getShow();
        },
        mounted(){
            //this.timer = setInterval(this.fleshList, 1000);
        },
        beforeDestroy() {
            clearInterval(this.timer);
        },
        data() {
            return {
                isShow:false,
                captcha: {},
            }
        },
        methods: {
            save(){
                let there = this;
                console.log(this.captcha)
                axios({
                    method: 'post',
                    url: 'api/captcha/save',
                    data:there.captcha
                }).then(function (res) {
                    there.get();
                }).catch(function (err) {
                    console.log(err);
                });
            },
            exchange(){
                let there = this;
                axios({
                    method: 'get',
                    url: 'api/show/change'
                }).then(function (res) {
                    console.log(res)
                    there.getShow();
                }).catch(function (err) {
                    console.log(err);
                });
            },
            get() {
                let there = this;
                axios({
                    method: 'get',
                    url: 'api/captcha/get'
                }).then(function (res) {
                    if( res.data.data.data){
                        there.captcha = res.data.data.data
                    }else {
                        there.captcha ={};
                    }
                }).catch(function (err) {
                    console.log(err);
                });
            },
            getShow() {
                let there = this;
                axios({
                    method: 'get',
                    url: 'api/show/get'
                }).then(function (res) {
                    console.log(res.data.data.show)
                    there.isShow = res.data.data.show
                }).catch(function (err) {
                    console.log(err);
                });
            },
            open(){
                window.location.href='index.html';
            }
        },
    })
</script>
</html>